<template>
  <!-- 过程指导 -->
  <div>
    <!-- 头部区域 -->
    <div class="head">
      <el-descriptions :column="3" border>
        <el-descriptions-item>
          <template slot="label"> 我的毕业设计课题 </template>
          <router-link to="/mytopic">{{ topic }}</router-link>
        </el-descriptions-item>
        <el-descriptions-item>
          <template slot="label"> 指导老师 </template>
          <router-link
            :to="{ path: '/teacherinfo', query: { id: teacher_id } }"
            >{{ teacher }}</router-link
          >
        </el-descriptions-item>
      </el-descriptions>
    </div>
    <!-- 文本区域 -->
    <div class="content">
      <el-table :data="tableData" style="width: 100%">
        <el-table-column label="指导时间" width="180">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{
              scope.row.direct_date | formatData
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="指导记录来源" width="180">
          <template slot-scope="scope">
            <span style="margin-left: 10px">{{ scope.row.direct_from }}</span>
          </template>
        </el-table-column>

        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">
              <router-link
                :to="{ path: '/record_text', query: { id: scope.row.id } }"
                >阅读</router-link
              >
            </el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>
<script>
export default {
  created() {
    this.getinfo();
    this.getdirect();
  },

  data() {
    return {
      dialogVisible: false,
      topic: "",
      teacher: "",
      direct_status: "",
      tableData: [],
      teacher_id: "",
    };
  },
  filters: {
    formatData(time, arg) {
      return new Date(time).toLocaleString();
    },
  },
  methods: {
    getinfo() {
      this.$http.get("http://127.0.0.1:8080/my/getTopic").then((res) => {
        // console.log(res);
        if (res.data.status == 0) {
          this.topic = res.data.data[1][0].topic_name;
          this.teacher = res.data.data[0][0].teacher_name;
          this.teacher_id = res.data.data[0][0].id;
        } else {
          this.topic = "";
          this.teacher = "";
        }
      });
    },
    getdirect() {
      this.$http.get("http://127.0.0.1:8080/my/direct").then((res) => {
        // console.log(res.data.data[0]);
        if (res.data.status == 0) {
          this.tableData = res.data.data;
        } else {
          this.tableData = [];
        }
        // console.log(this.tableData);
        // if (res.data.data[0].direct_status == 0) this.direct_status = "已确认";
      });
    },
    handleEdit(index, row) {
      // console.log(index, row);
    },
  },
};
</script>
<style lang="less" scoped>
.content {
  margin: 20px 0;
}
</style>
